import * as React from "react";
import {PropTypes} from "react";
import { RegisterPage } from "../root";

import {OrgSelector} from '../team/index';


const schema = {
    title: '星级榜样列表',
    toolbar: {
        disabledOn: '!data.org_id && !acl.can("skip:select-org")',
        type: 'button',
        label: '新增',
        level: 'info',
        actionType: 'dialog',
        dialog: {
            title: '新增',
            size: 'lg',
            body: {
                type: 'form',
                api: "post:/api/good_example?org_id=${org_id}",
                controls: [
                    {
                        label: '姓名',
                        required: true,
                        type: 'text',
                        name: 'name'
                    },
                    {
                        label: '头像',
                        name: 'avatars',
                        required: true,
                        desc: '请选择 jpg 或者 png 图片，单个文件请不要超过 10M，建议尺寸比例：（120 x 120）。',
                        type: 'image'
                    },
                    {
                        label: '政治面貌',
                        required: true,
                        name: 'political_affiliation',
                        type: 'text'
                    },
                    {
                        label: '单位',
                        required: true,
                        name: 'workplace',
                        type: 'text'
                    },
                    {
                        label: '上架状态',
                        name: 'status',
                        type: 'switch'
                    },
                    [{
                        label: "上架时间",
                        type: "datetime",
                        name: "publish_time"
                    }, {type: 'plain'}],
                    {
                        label: '简介',
                        required: true,
                        name: 'abstracts',
                        type: 'textarea'
                    },
                    {
                        label: '详细介绍',
                        required: true,
                        name: 'description',
                        type: 'rich-text'
                    }
                ]
            }
        }
    },
    body: [
        {
            visibleOn: '!data.org_id && !acl.can("skip:select-org")',
            type: 'tpl',
            tpl: `<div class="alert alert-warning">请先选择一个机构</div>`
        },

        {
            visibleOn: 'data.org_id || acl.can("skip:select-org")',
            type: 'crud',
            api: "get:/api/good_example",
            columnsTogglable: false,
            showFooter: false,
            filter: {
                title: "",
                panelClassName: 'm-b-none bg-gd no-border',
                bodyClassName: 'wrapper-sm',
                controls: [
                    {
                        type: "text",
                        name: "keywords",
                        placeholder: "姓名"
                    }
                ]
            },
            bulkActions: [
                {
                    label: '删除',
                    type: 'button',
                    level: 'danger',
                    actionType: 'ajax',
                    confirmText: '确定要删除选定项目？',
                    api: "delete:/api/good_example/${ids}"
                },
                {
                    label: '批量上架',
                    type: 'button',
                    level: 'success',
                    actionType: 'ajax',
                    confirmText: '确定要批量上架选定项目？',
                    api: "post:/api/good_example/online/${ids}"
                },

                {
                    label: '批量下架',
                    type: 'button',
                    level: 'danger',
                    actionType: 'ajax',
                    confirmText: '确定要批量下架选定项目？',
                    api: "post:/api/good_example/offline/${ids}"
                }
            ],
            columns: [
                {
                    label: 'ID',
                    name: 'id'
                },
                {
                    label: '姓名',
                    name: 'name'
                },
                {
                    label: '头像',
                    name: 'avatars',
                    type: 'image',
                    popOver: {
                        title: "",
                        body: '<div class="w w-xxl"><img class="w-full" src=${avatars} /></div>'
                    }
                },
                {
                    label: '政治面貌',
                    name: 'political_affiliation'
                },
                {
                    label: '单位',
                    name: 'workplace'
                },
                {
                    label: '状态',
                    name: 'status',
                    type: 'map',
                    map: {
                        '*': '<span class="label label-default">未启动</span>',
                        '1': '<span class="label label-info">已启动</span>'
                    }
                },
                {
                    label: '上架时间',
                    name: 'publish_time',
                    type: 'tpl',
                    tpl: '<% if (data.status) {%><%= formatTimeStamp(data.publish_time, "LLL") %><% } %>'
                },

                {
                    type: 'operation',
                    label: '操作',
                    buttons: [
                        {
                            label: '编辑',
                            type: 'button',
                            actionType: 'dialog',
                            size: 'xs',
                            level: 'success',
                            dialog: {
                                title: '编辑',
                                size: 'lg',
                                body: {
                                    type: 'form',
                                    api: "put:/api/good_example/${id}",
                                    controls: [
                                        {
                                            label: '姓名',
                                            required: true,
                                            type: 'text',
                                            name: 'name'
                                        },
                                        {
                                            label: '头像',
                                            name: 'avatars',
                                            required: true,
                                            desc: '请选择 jpg 或者 png 图片，单个文件请不要超过 10M，建议尺寸比例：（120 x 120）。',
                                            type: 'image'
                                        },
                                        {
                                            label: '政治面貌',
                                            required: true,
                                            name: 'political_affiliation',
                                            type: 'text'
                                        },
                                        {
                                            label: '单位',
                                            required: true,
                                            name: 'workplace',
                                            type: 'text'
                                        },
                                        {
                                            label: '上架状态',
                                            name: 'status',
                                            type: 'switch'
                                        },
                                        [{
                                            label: "上架时间",
                                            type: "datetime",
                                            name: "publish_time"
                                        }, {type: 'plain'}],
                                        {
                                            label: '简介',
                                            required: true,
                                            name: 'abstracts',
                                            type: 'textarea'
                                        },
                                        {
                                            label: '详细介绍',
                                            required: true,
                                            name: 'description',
                                            type: 'rich-text'
                                        }
                                    ]
                                }
                            }
                        },
                        {
                            label: '上架',
                            type: 'button',
                            size: 'xs',
                            level: 'success',
                            visibleOn: 'data.status != 1',
                            actionType: 'ajax',
                            confirmText: '确定要上架选定项目？',
                            api: "post:/api/good_example/online/${id}"
                        },

                        {
                            label: '下架',
                            type: 'button',
                            size: 'xs',
                            level: 'danger',
                            visibleOn: 'data.status == 1',
                            actionType: 'ajax',
                            confirmText: '确定要下架选定项目？',
                            api: "post:/api/good_example/offline/${id}"
                        },
                        {
                            label: '删除',
                            type: 'button',
                            level: 'danger',
                            size: 'xs',
                            actionType: 'ajax',
                            confirmText: '确定要删除选定项目？',
                            api: "delete:/api/good_example/${id}"
                        }
                    ]
                }
            ]
        }
    ]
};

RegisterPage({
  path: "good_example",
  label: "星级榜样",
  icon: "fa fa-star",
  acl: 'good_example',
  NavComponent: OrgSelector,
  NavComponentTest: ({user}) => user.type == 4,
  schema,
  url: "/good_example",
});
